import React, { Component } from 'react'
import TotalPrice from './TotalPrice'
import Connect from './Connect'
import axios from 'axios'
import {connect} from 'react-redux'
interface IProps{
     initData:(car:any)=>void,
     carData:any
}
interface IState{
    name:string
}
export class index extends Component<IProps,IState> {
    componentDidMount(){
        axios.get("/car").then((res)=>{
            console.log(res.data);
            let {initData} = this.props
            initData(res.data)
        })
    }
    render() {
        console.log(this.props.carData);
        
        return (
            <div className='index'>
                <div className="head">
                    <div id="top">
                <b>购物车</b>
                <span>完成</span>   
                </div> 
                <div id="list">
                    <b>商品清单</b>
                    <b>总重量约25kg</b>
                </div>
                </div>
               
                <Connect groups={this.props.carData}></Connect>
                <TotalPrice></TotalPrice>
                
            </div>
        )
    }
}
const state= (state:any)=>{
    return {
        carData:state.groups
    }
}
const dispatch = (dispatch:any)=>{
    return {
        initData(car:any){
            dispatch({type:"INIT_DATA",car})
        }
    }
}
export default connect(state,dispatch)(index)
